<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="gwt:property" content="locale=fr"/>
    <title>Juggers !</title>
    <link rel="icon" type="type/png" href="images/favicon.png" />
    <!--<script type="text/javascript" language="javascript" src="juggers/juggers.nocache.js"></script>-->
    <link rel="stylesheet" href="styles/main.css" type="text/css" media="screen" />
    <script type="text/javascript" src="scripts/gspreadsheet.js"></script>
<script src="http://www.google.com/jsapi"></script>
<script>
  google.load("prototype", "1.6.1.0");
  google.load("scriptaculous", "1.8.3");
</script>
<script type="text/javascript">
window.onload = function() {

    Array.prototype.randomize = function()
    {
        var i = this.length;
        if ( i == 0 ) return;
        while (--i) {
         var j = Math.floor(Math.random()*(i+1));
         var tmp1 = this[i];
         var tmp2 = this[j];
         this[i] = tmp2;
         this[j] = tmp1;
        }
        return this;
    };

    GSpreadsheet.load("tPGvWi05Kz8biVPrBRgg5gg", { index: 'nom' }, function(gs) {
      // display all
      $("displayall").innerHTML = gs.displayAll('style="border: solid 1px black; margin: 10px;"');
      juggers = $$( "#displayall table tbody tr" );
      juggers.each( Element.hide );
      juggers.each( function( element ) {
          element.down().remove();
          element.down(2).remove();
      } );
      juggers.randomize();
    });

  }

var idx = 1;
play = function() {
    idx++;
    new Effect.Appear( juggers[idx] );
}
  </script>

<style type="text/css">
#displayall {
min-height: 300px;
}
#displayall table {
    width: 90%;
    text-align: center;
}

#displayall table tbody tr td {
   border: none;
   background: #fff;
   color: #000;
   font-size: 20px;
}
</style>

  </head>

  <body>

  <div id="main">

      <div id="header">
        <h1>
          <img class="logo-juggers" src="images/logo-juggers.png" alt="Juggers.org" title="logo Juggers.org" />
            <span class="soustitre">La communaut&eacute; des utilisateurs de Java</span>
        </h1>
      </div>
    <ul id="menu"></ul>
      <button onclick="play()">Play !</button>
      <div id="page" class="news">
        <div id="displayall"></div>
        <div id="onebyindex"></div>
        <div id="onebyrownum"></div>
        <div id="displayrow"></div>
    </div>
    <p id="footer">
      Juggers est une initiative du BreizhJug - service gratuit offert &agrave; tous les Java User Groups.
      </p>
    </div>
  </body>
</html>
